import React,{useState,useEffect} from 'react'
import './Profile.css'
import { RightOutline } from 'antd-mobile-icons'
import { useNavigate } from 'react-router-dom'
import { CloseOutline } from 'antd-mobile-icons'
export default function Profile() {
  const navigate = useNavigate()
  const [data,setData] = useState({
    name:"Strive",
    img:'https://img.axureshop.com/76/f2/4c/76f24c3cde0f4d4e89019bd9147be2a7/images/%E6%88%91%E7%9A%84/u1100.png',
    day:2,
    gender:'男',
    birth:'2000-01-01',
  })
  return (
    <div className='profile'>
      <div className='profile_top'>
        <CloseOutline fontSize={24} onClick={() => navigate(-1)}/>
      </div>
      <div className='profile_content'>
        <img src={data.img}></img>
        <p><b>修改头像</b></p>
      </div>
      <div className='profile_bottom'>
        <div className='profile_bottom_item'>
          <p><b>昵称</b></p>
          <p className='profile_bottom_item_right'>{data.name} <RightOutline/></p>
        </div>
        <div className='profile_bottom_item'>
          <p><b>性别</b></p>
          <p className='profile_bottom_item_right'>{data.gender} <RightOutline/></p>
        </div>
        <div className='profile_bottom_item'>
          <p><b>出生日期</b></p>
          <p className='profile_bottom_item_right'>{data.birth} <RightOutline/></p>
        </div>
      </div>
      <div></div>
    </div>
  )
}
